<template>
  <div class="order_home" >
        <div class="order_box" v-if="orderList.length>0">
          <OrderItem
        v-for="item in orderList"
        :key="item.id"
        :info='item'
        ></OrderItem>
        </div>
         <p class="end_p"  v-if="isEnd&&orderList.length>0">------ 我是有底线的  ------ </p>
         <Empty v-if="orderList.length==0&&!isLoading"></Empty>
  </div>
</template>

<script>
import OrderItem from "@/components/OrderItem";
import Empty from "@/components/Empty";
import api from "@/utils/api";
export default {
  data() {
    return {
      orderList: [],
      postData: {
        pageIndex: 1,
        pageSize: 10
      },
      isEnd: false,
      isLoading: false
    };
  },
  components: {
    OrderItem,
    Empty
  },
  // 上拉加载
  onReachBottom() {
    //执行上拉执行的功能
    this.loadMore();
  },

  async onPullDownRefresh() {
    // to doing..
    // 停止下拉刷新
    this.Refresh();
    wx.stopPullDownRefresh();
  },
  async mounted() {

  },
  onShow(){
  wx.setNavigationBarTitle({
      title: "我的订单"
    });
    this.Refresh();
  },
  methods: {
    loadMore() {
      if (this.isEnd) return;
      this.postData.pageIndex++;
      this.getList();
    },
    Refresh() {
      this.postData.pageIndex = 1;
      this.isEnd = false;
      this.getList();
    },
    getList() {
      this.isLoading = true;
      let option = this.postData;
      api.customer
        .customerOrderList(option)
        .then(res => {
          this.isLoading = false;
          console.log("res", res);
          if (res && res.code == 0) {
            let { data, total } = res.data;
            if (this.postData.pageIndex == 1) {
              this.orderList = data;
            } else {
              this.orderList.push(...data);
            }
            if (this.postData.pageIndex * this.postData.pageSize >= total) {
              this.isEnd = true;
            }
          } else {
            this.toastError(res.msg);
          }
        })
        .catch(err => {
          this.isLoading = false;
          this.isEnd = true;
          this.toastError("网络繁忙");
        });
    }
  }
};
</script>

<style scoped>
.order_home {
  background-color: #f8f8f8;
  min-height: 100vh;
}
.order_box {
  padding: 10px 0;
}
</style>
